<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, height=device-height, user-scalable=0,  minimum-scale=1, maximum-scale=1">
  <title>订单详情</title>
  <link rel="stylesheet" href="../style/orderDetail.css">
  <link rel="stylesheet" href="../style/public.css">
</head>

<body>
  <div class="app">
    <header class="header">
      <span class="header-back"></span>
      <div class="header-title">
        订单[2016252525566]详情
      </div>
    </header>
    <!--进度-->
    <div class="state">
      <ul class="stateList">
        <li class="stateList-item">
          <span class="stateList-item-text">下单</span>
          <i class="stateList-item-icon"></i>
        </li>
        <li class="stateList-item">
          <i class="stateList-item-icon"></i>
          <span class="stateList-item-text">支付</span>
        </li>
        <li class="stateList-item">
          <span class="stateList-item-text">配送</span>
          <i class="stateList-item-icon"></i>
        </li>
        <li class="stateList-item">
          <i class="stateList-item-icon"></i>
          <span class="stateList-item-text">完成</span>
        </li>
        <li class="stateList-item">
          <span class="stateList-item-text">取消</span>
          <i class="stateList-item-icon"></i>
        </li>
      </ul>
      <section class="progress">
        <div class="progress_info" style="width: 20%"></div>
      </section>
    </div>

    <!--地址信息-->
    <ul class="address">
      <li class="addressItem">
        <div class="addressItem-logo">
          <img class="addressItem-logo-img" src="" alt="">
          <span class="addressItem-logo-text">发货方:</span>
        </div>
        <div class="addressItem-content">
          <p>福建省创企信息科技有限公司</p>
          <p>15759580000</p>
        </div>
      </li>

      <li class="addressItem">
        <div class="addressItem-logo">
          <img class="addressItem-logo-img" src="" alt="">
          <span class="addressItem-logo-text">收货方:</span>
        </div>
        <div class="addressItem-content">
          <p>福建省创企信息科技有限公司</p>
          <p>15759580000</p>
        </div>
      </li>
    </ul>

    <div class="goodType">
      <img class="goodType-img" src="" alt="">
      <span class="goodType-text">货品类型:</span>
      <span class="goodType-content">美食</span>
    </div>
    <div class="time">
      <img class="time-img" src="" alt="">
      <span class="time-text">配送时间:</span>
      <span class="time-content">立即取货</span>
    </div>
    <div class="distance">
      <img class="distance-img" src="" alt="">
      <span class="distance-text">配送距离:</span>
      <span class="distance-content">10km</span>
    </div>
    <div class="money">
      <img class="money-img" src="" alt="">
      <span class="money-text">配送金额:</span>
      <span class="money-content">￥20.00 + ￥3.00 = <span class="money-content-color">￥23.00</span></span>
    </div>

  </div>
</body>

</html>